<template>
    <div class="title">{{ title }}</div>
    <div class="juzhong">
        <div class="showRes">
            <div class="polyn" v-html="polyn"></div>
            <div class="polyn">{{ val }}</div>
        </div>
    </div>
</template>

<script>
export default {
    props: ["val", "polyn", "title"],
};
</script>

<style>
.juzhong {
    position: relative;
}

.title {
    font-weight: 700;
    color: #fff;
    font-size: 1.1em;
    text-align: center;
    margin: 17px;
}

.showRes {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 0%);

    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 60%;
}
</style>
